<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文字阴影实现</title>
</head>
<body>
  <h1>文字阴影实现</h1>
  <style>
    h1{
      font-size: 200px;
      position: relative;
      color: #469c50;
      margin-left: 250px;
    }
    h1:after {
      content: '文字阴影实现';
      position: absolute;
      left: 0;
      color: black;
      transform:translate(-129px, 50px)  scaleY(0.5) skew(50deg);
      z-index: -1;
      /*模糊*/
      filter: blur(5px);
      /*渐变蒙层*/
      mask: linear-gradient(transparent, black);
    }
  </style>
</body>
</html>